<template>
    <div class="crumb">
        <el-breadcrumb separator-icon="CaretRight">
            <template v-for="item in breadcrumbs" :key="item.name">
                <el-breadcrumb-item :to="{ path: item.path }">{{ item.name }}</el-breadcrumb-item>
            </template>
        </el-breadcrumb>
    </div>
</template>
<script setup lang="ts">
import useLoginStore from '@/store/login/login';
import { mapPathToBreadcrumbs } from '@/utils/map-menu';
import { computed } from 'vue';
import { useRoute } from 'vue-router';

const route = useRoute();
const userMenus = useLoginStore().userMenus
const breadcrumbs = computed(() => {
    return mapPathToBreadcrumbs(route.path, userMenus)
})

</script>
<style lang="less" scoped>
.crumb {}
</style>
